<html>
    <head>
        <title>测试</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <style>
            .center-center{display:flex;flex-direction:column;justify-content:center;align-items: center;}
            .hide{display: none;}
        </style>
    </head>
    <body>
        <div class="root center-center">
            <h2>这里是测试</h2>
            <div class="draw-img">
                <div id="hide-tangshi">汉皇重色思倾国，御宇多年求不得。杨家有女初长成，养在深闺人未识。</div>
                <img style="width: 100%;" src="" alt="" id="draw-text">
            </div>
        </div>
    </body>
    <script src="./output/js/text2img.js"></script>
    <script src="./output/js/yStorage.js"></script>
    <script>
        const chanhenge = document.getElementById('hide-tangshi').innerHTML;
        if(window.text2img){
            document.getElementById('draw-text').src = window.text2img.draw(chanhenge);
        }
        const yStorage = window.yStorage;
        const cache = yStorage.lGet('test');
        if(cache){
            console.log(cache);
        }else{
            console.log('缓存失效，重新存储');
            yStorage.lSet('test',chanhenge,5 * 1000);
        }
    </script>
</html>
